<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<%@taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<html>
<head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <!-- 上述3个meta标签*必须*放在最前面，任何其他内容都*必须*跟随其后！ -->
    <!-- 新 Bootstrap 核心 CSS 文件 -->
    <link rel="stylesheet" href="${pageContext.request.contextPath}/css/bootstrap.min.css">

    <!-- jQuery文件。务必在bootstrap.min.js 之前引入 -->
    <script src="${pageContext.request.contextPath}/js/jquery-2.2.4.min.js"></script>

    <!-- 最新的 Bootstrap 核心 JavaScript 文件 -->
    <script src="${pageContext.request.contextPath}/js/bootstrap.min.js"></script>
    <link rel="stylesheet" href="${pageContext.request.contextPath}/css/bootstrap.css">
    <link rel="stylesheet" href="${pageContext.request.contextPath}/css/bootstrap-fileinput.css">
    <script src="${pageContext.request.contextPath}/js/jquery-2.2.4.min.js"></script>
    <script src="${pageContext.request.contextPath}/js/bootstrap.min.js"></script>
    <script src="${pageContext.request.contextPath}/js/bootstrap-fileinput.js"></script>

    <title>个人信息修改</title>
    <link href="${pageContext.request.contextPath}/images/logo.ico" rel="icon" type="image/x-ico">
    <style type="text/css">
        .namebox{
            width: 100%;
            white-space: nowrap;
            overflow: hidden;/*超出部分隐藏*/
            text-overflow: ellipsis;/*用...代替超出部分*/
            text-align: center;
        }
        a:focus{text-decoration: none}
    </style>

</head>
<body>

<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<!-- 上述3个meta标签*必须*放在最前面，任何其他内容都*必须*跟随其后！ -->
<!-- 新 Bootstrap 核心 CSS 文件 -->
<link rel="stylesheet" href="${pageContext.request.contextPath}/css/bootstrap.min.css">

<!-- jQuery文件。务必在bootstrap.min.js 之前引入 -->
<script src="${pageContext.request.contextPath}/js/jquery-2.2.4.min.js"></script>

<!-- 最新的 Bootstrap 核心 JavaScript 文件 -->
<script src="${pageContext.request.contextPath}/js/bootstrap.min.js"></script>

<script type="text/javascript">
    $(document).ready(function(){
        /* var wd = $(".nav-pills").width();*/
        jQuery(window).scroll(function() {
            $("#top_cate").css("z-index", 9999);
        });

        $("#top_cate").affix({
            offset: {
                top: 25,
                bottom: function () {
                    return (this.bottom = $('.bottom').outerHeight(true));
                }

            }
        });
    });
</script>

<div class="container">
    <div class="row clearfix">


        <div class="col-md-10 column">
            <div class="row">
                <h3 style="text-align: center">信息修改</h3>
            </div>

            <form id="userAction_save_do" name="Form1"
                  action="${pageContext.request.contextPath}/update.do" method="post">

                    <input type="hidden" name="id" value="${user.id}" id="id"/> &nbsp;
                <div class="row">

                    <div class="col-lg-6" style="padding: 20px">

                        <div class="form-group">
                            <label name="pname" class="col-sm-3 control-label">用户名称</label>
                            <div class="col-sm-8">
                                <input type="text" class="form-control" id="username" name="username" value="${user.username}">
                            </div>
                        </div>
                        <div class="form-group">
                            <label name="pemail" class="col-sm-3 control-label">用户邮箱</label>
                            <div class="col-sm-8">
                                <input type="hidden" value="${user.email}" name="email" id="email">
                                <input readonly="readonly" type="text" class="form-control"  value="${user.email}">
                            </div>
                        </div>
                        <div class="form-group">
                            <label name="pgender" class="col-sm-3 control-label">用户性别</label>
                            <div class="col-sm-8">
                                <input type="text" class="form-control" id="gender" name="gender" value="${user.gender}">
                            </div>
                        </div>
                    </div>

                </div>
               <div><a href="#" class="contact" onclick="update()">保存</a>  </div>
            </form>
        </div>
    </div>
</div>
<script>
    function update() {
        var username = $("#username").val();
        var email = $("#email").val();
        var gender = $("#gender").val();


        $.ajax({
            url:"${pageContext.request.contextPath}/update.do",
            type:"POST",
            contentType:'application/json',
            data:JSON.stringify({username:username,email:email,gender:gender}),
            dataType:"json",
            error:function(data){

            },
            success:function (data) {
                alert(data.message);
                window.location.href="${pageContext.request.contextPath}/tiaozhuan.do";
            }
        })
    }
</script>
</body>
</html>